<template>
	<view>
    <ikz-loading  :css-data="loading_css"></ikz-loading>
		<form @submit="formSubmit" class="main">
			<view class="ikz-add">
				<view class="addRec-menu-o">
					<view class="addRec-menu-o-left">收件姓名</view>
					<view class="addRec-menu-o-right">
						<input name="name" placeholder="请输入收件姓名" :value="name" style="height:60rpx;" cursor-spacing="5" />
					</view>
				</view>
				<view class="addRec-menu-o">
					<view class="addRec-menu-o-left">收件电话</view>
					<view class="addRec-menu-o-right">
						<input name="mobile" type="number" :value="mobile" placeholder="请输入收件电话" style="height:60rpx;" cursor-spacing="5" />
					</view>
				</view>
				<view class="addRec-menu-o">
					<view class="addRec-menu-o-left">收货地址</view>
					<view class="addRec-menu-o-right" @click="geselectAddress">
				    <view style="color: #828282;">
				      {{group_name}}
				    </view>
				    <view class="ikz-cell-ft-in-access">
				    </view>
						<!-- <input name="address" placeholder="" value="" style="height:60rpx;" cursor-spacing="5" /> -->
					</view>
				</view>
				<view class="addRec-menu-o">
					<view class="addRec-menu-o-left">详细地址</view>
					<view class="addRec-menu-o-right">
						<input name="detail" placeholder="请输入详细地址" style="height:60rpx;" :value="detail" />
					</view>
				</view>
				<view class="addRec-menu-o">
					<view class="addRec-menu-o-left">默认地址</view>
					<view style="margin-left:2%;">
						<view class="addRec-menu-o-right">
              <switch type="checkbox" @change="switchChange" :checked="defaults" />
            </view>
					</view>
				</view>
			</view>
			<view>
				<input hidden="hidden" name="id" :value="id" />
				<button  class="ikz-add-address-btn"  form-type="submit">确定</button>
			</view>
		</form>
	</view>
</template>

<script>
import ikz from '@/pages/Common/tools';
import ikzLoading from '@/pages/Component/Public/Loading/loading.vue';
var app = getApp();
export default {
	data() {
		return {
			id: '',
			name: '',
			mobile: '',
			detail: '',
			group_name: '',
			defaults: false, //默认地址
			current_addr: {} ,//点击获取的用户信息
			color:'',
      loading_css:{
        display:'flex'
      },
      show_status:2,
		};
	},
  
	onLoad: function(options) {
		console.log(options);
		if (options.defaults == 'true') {
			options.defaults = true;
		} else {
			options.defaults = false;
		}
		var index = options.index;
		this.id = options.id;
		this.name = options.name;
		this.mobile = options.mobile;
		this.detail = options.detail;
		this.group_name = options.group_name;
		this.defaults = options.defaults;
		this.index = options.index;
	},
  onShow:function(){
    this.loading_css.display = 'none';
    if(this.show_status == 2){
      this.show_status = 3;
    }else{
      var group_name= app.globalData.campus_data;
      if(group_name){
        this.group_name = group_name;
      }else{
        this.group_name = '请选择收货地址';
      }
    }
    
  },
	methods: {
    geselectAddress(){
      app.globalData.campus_data = '';
      uni.navigateTo({
        url:'/pages/Component/Module/Address/Program/selectAddress/index'
      })
    },
		//修改地址
		formSubmit: function(e) {
			var that = this;
			//判断座机或者手机
			var mo = /^(\d{3,4}\-)?\d{7,8}$/i;
			var mob = /^1[34578]\d{9}$/i;
			var zuoji = mo.test(e.detail.value.mobile);
			var shouji = mob.test(e.detail.value.mobile);
			if (e.detail.value.name == '') {
				wx.showToast({
					title: '收件姓名不能为空',
					icon: 'error',
					duration: 2000
				})
				return
			}
			if (e.detail.value.mobile == '') {
				wx.showToast({
					title: '收件电话不能为空',
					icon: 'error',
					duration: 2000
				})
				return
			}
			
			if (e.detail.value.detail == '') {
				wx.showToast({
					title: '详细地址不能为空',
					icon: 'error',
					duration: 2000
				})
				return
			}
			if(this.group_name == '请选择收货地址'){
			  wx.showToast({
			  	title: '请选择收货地址',
			  	icon: 'error',
			  	duration: 2000
			  })
			  return
			}
			if (zuoji || shouji) {
				var defaults = this.defaults;
				var path = '/xyb/user_address/edit';
				var data = {
					id: e.detail.value.id,
					name: e.detail.value.name,
					mobile: e.detail.value.mobile,
					detail: e.detail.value.detail,
					group_name: this.group_name,
					defaults: defaults
				};
				ikz.get(path, data, res => {
					// console.log(res)
					if (res.data.code) {
						var index = that.index;
						var address_all = app.globalData.user_address.address_all || [];
						if (defaults) {
							if (address_all.length > 0) {
								for (var i = 0; i < address_all.length; i++) {
									if (address_all[i].defaults) {
										address_all[i].defaults = false;
									}
								}
							}
							app.globalData.user_address.address_default = data;
							app.globalData.user_address.address_current = data;
						}
						address_all[index] = data;
						app.globalData.user_address.address_all = address_all;
						uni.showToast({
							title: '地址修改成功',
							icon: 'success',
							duration: 2000,
							success:function(){
								
							}
						});
            setTimeout(function(){
             uni.navigateBack({
             	delta: 1 // 回退前 delta(默认为1) 页面
             });
             uni.hideLoading()
            },2000)
						
					} else {
						uni.showModal({
							title: '提示',
							content: res.data.msg,
							showCancel: false
						});
            uni.hideLoading()
					}
				});
			} else {
				uni.showToast({
					title: '请填写正确格式的联系方式！',
					icon: 'success',
					duration: 2000
				});
			}
		},

		//点击 默认地址
		switchChange: function(e) {
			var that = this;
			this.defaults = e.detail.value;
      this.$forceUpdate();
		}
	}
};
</script>

<style>
page {
		background: #f2f2f2;
	}

	.main {
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		/* width:100%; */
	}

	.ikz-add {
		width: 90%;
    margin:10px auto;
		border-radius: 10rpx;
		background: #fff;
	}

	.addRec-menu-o {
		font-family: Arial, Helvetica, sans-serif;
		font-size: 36rpx;
		border-bottom: 1px solid #eee;
	}

	.reciver-top {
		height: 70rpx;
		background-color: #2d90e5;
		text-align: center;
		color: white;
		line-height: 70rpx;
	}

	.addRec-menu-o-left {
		line-height: 60rpx;
		width: 20%;
	}

	.addRec-menu-o {
		display: flex;
		flex-direction: row;
    justify-content: space-between;
		padding: 20rpx;
		font-size: 30rpx;
	}

	.addRec-menu-o-right {
		width: 70%;
		color: gainsboro;
		font-size: 30rpx;
    display: flex;
    align-items: center;
    justify-content: space-between;
	}

	.addRec-menu-o-right input {
		height: 70rpx;
		color: black;
	}

	.addRec-menu-o-right button {
		margin-left: 120rpx;
	}
  .ikz-add-address-btn{
    width:90%;
    margin-top:60rpx;
    background: linear-gradient(to right, #FBAB7E, #F8C66D);
    border:none;
    border-radius: 50px;
    color: #fff;
  }
  .ikz-cell-ft-in-access{
     width: 7px;
      height: 7px;
      border-top: 1px solid #828282;
      border-right: 1px solid #828282;
      transform: rotate(45deg);
  }
</style>
